import QtQuick 2.0

Image {
    id: root;
    source: "rec/rec/image/background.png";

    MouseArea {
        id: area;
        anchors.fill: parent;
    }

    ClickableImageV2 {
        id: rocket1;
        x: 40;
        y: 200;
        source: "rec/rec/image/ufo.png";
        text: qsTr("animation on property");
        NumberAnimation on y {
            to: 40; duration: 4000;
        }
    }

    ClickableImageV2 {
        id: rocket2;
        x: 240;
        y: 200;
        source: "rec/rec/image/ufo.png";
        text: qsTr("Behavior on property");
        Behavior on y {
            NumberAnimation { duration: 4000; }
        }

        onClicked: {
            y = 40;

        }
    }

    ClickableImageV2 {
        id: rocket3;
        x: 440;
        y: 200;
        source: "rec/rec/image/ufo.png";
        text: qsTr("standalone animation");

        onClicked: {
            anim.start();
        }

        NumberAnimation {
            id: anim;
            target: rocket3;
            properties: "y";
            from: 205; to: 40;
            duration: 4000;
            running: area.pressed;
        }
    }

    NumberAnimation on opacity {
        from: 0.6;
        to: 1;
        duration: 400;
        easing.type: Easing.InQuad;
    }
}
